
import React, { Component } from 'react';
import { StyleSheet, NavigatorIOS, TabBarIOS } from 'react-native';
import FirstHomePageView from '../firstComponent/firstHomePageView';
import SecondPageView from '../firstComponent/NineBoxPageView';

class FirstTabBarItem extends Component {
    _onRightButtonPress(){
        this.refs.nav.push({
            title: '九宫格布局',
            component: SecondPageView,
            tintColor:'white',
            barTintColor: '#2D4486',
        });
    };

    render() {
        return (
        <NavigatorIOS
            ref='nav'
            style={styles.container}
            initialRoute={{
                     component: FirstHomePageView,
                     title: 'React-Native 布局',
                     passProps: { myProp: '传值用' },
                     rightButtonTitle:'九宫格',
                     backButtonTitle:'返回',
                     titleTextColor: 'white',
                     tintColor:'red',
                     barTintColor: '#2D4486',
                     onRightButtonPress:this._onRightButtonPress.bind(this)
                }}
            />
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#2D4486',
    }
});

export default FirstTabBarItem;